<template>
    <div class="mysoft">
        <!-- 轮播图 -->
        <div class="banner"></div>
        <!-- 商品详情 -->
        <ul>
            <li>   
                <!-- 上边内容简介 -->
                <div class="one">
                    <h1>小黄狗智能数据平台</h1>
                    <strong>Intelligent Data Platform National edition</strong>
                    <p>小黄狗智能数据平台通过大数据分析、用户管理、智能回收设备监管，对区域内智能设备的联通实施全程实时监控可与市级分类信息平台对接运行。</p>
                </div>
                <!-- 下边的图 -->
                <div><img src="/img/software/pic_date.jpg" alt=""></div>
            </li>
        </ul>
    </div>
</template>
<style lang="scss">
   .mysoft{
       background-color: #f6f6f6;
    //    轮播图
       .banner{
           background-image: url(/img/software/banner2.jpg);
           width: 100%;
           height: 400px;
       }
    //    软件商品内容
    ul{
        margin-top:20px;
        padding-bottom: 50px;
        list-style: none;
        //共同的样式
        li{
          width: 1200px;
          height: 470px;
          background-color: blueviolet;
          margin:0 auto;
          h1{
             font-size: 20px;
             line-height: 24px; 
          }
          strong{
              font-size: 15px;
          }
          p{
              font-size: 15px;
              margin-top: 18px;
          }
        }
        li:nth-child(1){
            .one{
             margin-bottom: 20px;
            
            }
            div:nth-child(2){
                height: 305px;
             img{
                height: 305px;
             }
            }
        }
    }
   }
</style>